<template>
  <view class="bgColor" style="min-height: 100vh">
<!--    <uni-nav-bar style="margin-top: 80rpx" height="50px" left-icon="left" @clickLeft="clickLeft"-->
<!--                 :title="navBarTitle"/>-->


    <view style="width: 95%;margin: auto;padding: 30rpx;border-radius: 20rpx;margin-top: 30rpx;background-color:white;">
      <uni-forms ref="validForm" :rules="rules" :modelValue="address">
        <uni-forms-item label="收件人" required name="recipient">
          <uni-easyinput v-model="address.recipient" placeholder="请输入收件人"/>
        </uni-forms-item>
        <uni-forms-item label="电话" required name="phone">
          <uni-easyinput v-model="address.phone" placeholder="请输入电话"/>
        </uni-forms-item>
        <uni-forms-item v-if="updateArea" label="所在地区" required name="area">
          <uni-easyinput v-model="address.area" @focus="btnClick" placeholder="请输入所在地区"/>
        </uni-forms-item>
        <uni-forms-item label="详细地址" required name="detailedAddress">
          <uni-easyinput type="textarea" v-model="address.detailedAddress" placeholder="请输入详细地址"/>
        </uni-forms-item>
      </uni-forms>
      <uni-data-checkbox multiple v-model="check" :localdata="info" @change="changeCheck"></uni-data-checkbox>
      <button type="primary" :disabled="buttonDisabled" @click="submit('validForm')">提交</button>
      <selectAddress ref='selectAddress' @selectAddress="successSelectAddress"></selectAddress>
    </view>

  </view>
</template>

<script>
import {addressService} from "../../../api/buyer/public/address";
import {BASE_IMG_URL} from "../../../api/service";
import selectAddress from '@/components/yixuan-selectAddress/yixuan-selectAddress.vue'

export default {
  name: "Address",
  components: {selectAddress},
  data() {
    return {
      user: {},
      address: {},
      navBarTitle: "",
      updateArea: true,
      edit: false,
      // 校验规则
      rules: {
        recipient: {
          rules: [{
            required: true,
            errorMessage: '收件人不能为空'
          }]
        },
        phone: {
          rules: [{
            required: true,
            errorMessage: '电话号码不能为空'
          }
          ]
        },
        area: {
          rules: [{
            required: true,
            errorMessage: '地区不能为空'
          }]
        },
        detailedAddress: {
          rules: [{
            required: true,
            errorMessage: '详细地址不能为空'
          }]
        }
      },
      check:"",
      info:[
        {
          text:"我同意提供个人信息(可以填写非真实用户信息)用于获取服务",
        value:"agree"
        }
      ],
      buttonDisabled:true
    }
  },
  created() {
    this.user = uni.getStorageSync('userInfo')
    this.address.userId = this.user.eid
  },
  onLoad(option) {
    console.log(option.address, "add")
    if (option.address) {
      const s = decodeURIComponent(option.address);
      let address = JSON.parse(s)
      this.address = address;
      this.navBarTitle = "编辑收获地址"
      this.edit = true
    } else {
      this.navBarTitle = "添加收获地址"
      this.edit = false
    }
    uni.setNavigationBarTitle({
      title: this.navBarTitle
    })
  },
  // onUnload(){
  //   this.clickLeft()
  // },
  methods: {

    clickLeft() {
      uni.$emit('updateAddressList')
      uni.navigateBack({
        delta: 1,
      })
    },
    clickRight() {
      this.deleteShow = !this.deleteShow
    },
    submit(ref) {
      this.$refs[ref].validate().then(res => {
        if (this.edit) {
          addressService.updateShippingAddress(this.address).then(res => {
            uni.showToast({
              title: `编辑成功`
            })
            this.clickLeft()
          }).catch(e => {
            uni.showToast({
              title: "编辑失败,原因是" + e.message
            })
          })
        } else {
          addressService.saveShippingAddress(this.address).then(res => {
            uni.showToast({
              title: `新增成功`
            })
            this.clickLeft()
            this.address={
              userId:this.user.eid
            };
          }).catch(e => {
            uni.showToast({
              title: "新增失败,原因是" + e.message
            })
          })
        }

      }).catch(err => {
        console.log('err', err);
      })
    },
    btnClick() {
      this.$refs.selectAddress.show()
    },
    successSelectAddress(address) { //选择成功回调
      this.address.area = address;
      this.updateArea = false
      this.updateArea = true
    },
    changeCheck(item){
      console.log()
      if(item.detail.value[0]=='agree'){
        this.buttonDisabled = false
      }else {
        this.buttonDisabled =true
      }
    }
  }
}
</script>

<style scoped>

</style>